import React from "react";
import '../../../static/css/pc/top.less';
import {Row,Col,Carousel } from 'antd';
import ImageText from '../components/imagetext';
import {Link} from 'react-router';

export default class Top extends React.Component{
	constructor(){
		super();
		this.state = {
			topNews:[]
		}
	}
	componentDidMount(){
		var result=fetch("http://www.wwtliu.com/sxtstu/news/juhenews.php?type=top&count=10",{
			method:'get'
		})
		.then(res =>{
			return res.json()
		})
		.then(json =>{
			this.setState({
				topNews:json
			})
		})
	}
	render(){
		var {topNews}=this.state;
		var count=6;
		//console.log(topNews)
		return(
			<div>
			    <div>
					<Row>
						<Col span={12}>
							<ul className='newsUL'>
								{
									topNews.map((item,index)=>{
										return <li key={item.uniquekey}><a href={item.url}>{item.title}</a></li>
									})
								}
							</ul>
						</Col>
						<Col span={12}>
							<div>
								<div className='carousel'>
									<Carousel  effect="fade">
										{
											topNews.map((item,index)=>{
												return <div key={item.uniquekey}><img src={item.thumbnail_pic_s02} alt='图片'/></div>
											})
										}
									</Carousel>
									<div className='details'>
										<Link to='/detail'>新闻2:点击我跳转到自己的详情页</Link>	
									</div>
								</div>
							</div>
						</Col>
					</Row>
				</div>
				<ImageText type='top' count={count}></ImageText>
			</div>
		)
	}
}